
<template>
  <div class="page-container">
    <ex_super_table_page v-bind="option" ref="superTablePage">
    </ex_super_table_page>

    <el-dialog :title="accountDialogTitle" :visible.sync="accountDialogFormVisible" width="520px" height="200px"
      :close-on-click-modal="false">

      <el-form ref="accountFormEl" :model="accountForm" :rules="rules" label-width="120px" class="common-form-panel-div"
        style="padding: 0px 10px; margin-top: 20px; ">

        <el-row>
          <el-col>
            <el-form-item :label="$tt('label_fms_account_cmp_as_customer')" prop="customerId">
              <common_customer_choose v-model="accountForm.customerId" style="width: 100%;"></common_customer_choose>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col>
            <el-form-item :label="$tt('label_fms_account_cmp_account_type')">
              {{ $tt('CustomerAccountTypeEnum__' + accountType) }}
            </el-form-item>
          </el-col>
        </el-row>

        <el-row v-if="accountType == 'CREDIT'">
          <el-col>
            <el-form-item :label="$tt('label_fms_account_cmp_is_product')">
              <ex_super_input type="select" enum="PmsProductTypeEnum"
                :placeholder="$tt('label_fms_account_cmp_sel_product')"
                :listHandler="list => list.filter(it => it != 'INSURANCE' && it != 'SWAP_TRANSPORT')"
                v-model="accountForm.productType" style="width: 100%;" />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row v-if="accountType == 'CASH'">
          <el-col>
            <el-form-item :label="$tt('label_fms_account_cmp_account_currency')">
              <fms-currency-choose v-model="accountForm.currencyType" style="width: 100%;"></fms-currency-choose>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row v-if="accountType == 'CREDIT'">
          <el-col>
            <el-form-item :label="$tt('label_fms_account_cmp_credit')">
              <el-input v-model="accountForm.creditAmount"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="accountDialogFormVisible = false">{{ $tt('label_cancel') }}</el-button>
        <el-button type="primary" @click="submitAccountForm">{{ $tt('label_confirm') }}</el-button>
      </div>
    </el-dialog>


    <el-dialog :title="$tt('label_fms_account_cmp_credit_apply')" :visible.sync="creditDialogFormVisible" width="520px"
      height="200px" :close-on-click-modal="false">
      <el-form ref="creditFormEl" :model="creditForm" :rules="rules" label-width="120px" class="common-form-panel-div"
        style="padding: 0px 10px; margin-top: 20px; ">
        <el-row>
          <el-col>
            <el-form-item :label="$tt('label_fms_account_cmp_as_customer')" prop="customerId">
              {{ '[' + creditForm.customerCode + '] ' + creditForm.customerName }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item :label="$tt('label_fms_account_cmp_is_product')">
              {{ $tt('PmsProductTypeEnum__' + creditForm.productType) }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item :label="$tt('label_fms_account_cmp_account_currency')">
              {{ $tt('CurrencyTypeEnum__' + creditForm.currencyType) }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item :label="$tt('label_fms_account_cmp_current_credit')">
              {{ creditForm.creditAmount }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item :label="$tt('label_fms_account_cmp_adjust_as')">
              <el-input v-model="creditForm.newCreditAmount" style="width: 70%;"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item :label="$tt('label_fms_account_cmp_adjust_reason')">
              <el-input v-model="creditForm.reason" style="width: 70%;"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="creditDialogFormVisible = false">{{$tt('label_cancel')}}</el-button>
        <el-button type="primary" @click="submitCreditForm">{{$tt('label_fms_account_cmp_submit_apply')}}</el-button>
      </div>
    </el-dialog>

  </div>
</template>
<script>

let moduleName = "label_fms_account_cmp_advance_account_manage"

import FmsCurrencyChoose from '@/component/fms/fms-currency-choose.vue'

import superTablePageFunction from '@/mixin/super-table-page-function';
export default {

  title: moduleName,
  components: { FmsCurrencyChoose, },

  mixins: [superTablePageFunction],
  data() {

    let _this = this

    return {

      accountDialogFormVisible: false,
      accountDialogTitle: '',
      accountForm: {},
      rules: {
        companyName: [
          { required: true, message: '请输入企业名称', trigger: 'blur' },
          { min: 3, max: 32, message: '长度在 3 到 32 个字符', trigger: 'blur' }
        ],
        companyShortCode: [
          { required: true, message: '请输入企业编码', trigger: 'blur' },
          { min: 3, max: 16, message: '长度在 3 到 16 个字符', trigger: 'blur' }
        ]
      },


      // creditDialogTitle: '信用额度调整申请',
      creditDialogFormVisible: false,
      creditForm: {

      }

    };
  },


  watch: {

  },

  created() {

    let _this = this

    let unit = this.accountType == 'CREDIT' ? this.$tt('label_quota') : this.$tt('label_money')

    _this.option = {
      search: {
        model: [
          {
            label: "label_fms_account_cmp_customer", key: "customerIds", type: 'common_customer_choose', attrs: { multiple: true, }, inputStyle: { 'width': '400px' },
          },
          {
            label: "label_status", key: "status", type: 'select', enum: 'IsAvailableStatusEnum', attrs: { clearable: true },
          }
        ],
      },
      action: [
        {
          label: 'label_fms_account_cmp_add_account', attrs: { icon: "el-icon-plus" }, click: () => {
            this.accountDialogTitle = this.$tt('label_fms_account_cmp_add_account')
            this.accountForm = {
            }
            this.accountDialogFormVisible = true
          }
        },
      ],

      table: {
        url: "/fms-api/customer/CustomerAccountRpc/query.json?accountType=" + this.accountType,
        attrs: {
          'cell-style': ({ row, column, rowIndex, columnIndex }) => {
            if (column.property == 'status') {
              return { color: row.status == 'NORMAL' ? this.$globalCss.successColor : this.$globalCss.infoColor }
            }
          }
        },
        model: [
          {
            key: 'companyName', label: 'label_fms_account_cmp_customer_name', align: 'left', attrs: {
              formatter: (r, c, v, i) => {
                return '[' + r.customerCode + '] ' + r.customerName
              }
            }
          },
          {
            key: 'accountType', label: 'label_fms_account_cmp_account_type', width: 120,
            attrs: {
              formatter: (r, c, v, i) => {
                return this.$enumShow(v, 'CustomerAccountTypeEnum')
              }
            }
          },
          {
            key: 'productType', label: 'label_fms_account_cmp_is_product', width: 120,
            if: () => { return this.accountType == 'CREDIT' },
            attrs: {
              formatter: (r, c, v, i) => {
                return this.$enumShow(v, 'PmsProductTypeEnum')
              }
            }
          },
          {
            key: 'currencyType', label: 'label_fms_account_cmp_account_currency', width: 120,
            attrs: {
              formatter: (r, c, v, i) => {
                return this.$enumShow(v, 'CurrencyTypeEnum')
              }
            }
          },

          { key: 'creditAmount', label: this.$tt('label_fms_account_cmp_credit_name') + unit, align: 'right', if() { return this.accountType == 'CREDIT' }, },
          { key: 'lockAmount', label: this.$tt('label_fms_account_cmp_withholding') + unit, align: 'right' },
          { key: 'freezeAmount', label: this.$tt('label_fms_account_cmp_freeze') + unit, align: 'right' },
          { key: 'leftAmount', label: this.$tt('label_fms_account_cmp_usable') + unit, align: 'right' },
          { key: 'totalAmount', label: 'label_fms_account_cmp_account_balance', align: 'right', if: () => { return this.accountType == 'CASH' } },
          { key: 'creditAmount', label: 'label_fms_account_cmp_line_of_credit', align: 'right', if: () => { return this.accountType == 'CREDIT' } },
          {
            key: 'status', label: 'label_fms_account_cmp_account_status', width: 120,
            attrs: {
              formatter: (r, c, v, i) => {
                return this.$enumShow(v, 'IsAvailableStatusEnum')
              }
            }
          },
          {
            type: 'operate', width: 180,
            operate: [

              {
                label: 'IsAvailableStatusEnum__DISABLED',
                type: "confirm-button",
                message: "label_fms_account_cmp_freeze_user_confirm",
                url: '/fms-api/customer/CustomerAccountRpc/disable.json',
                if: (row) => {
                  return row.status == 'ENABLE'
                },
                params: (v) => {
                  return { id: v.id }
                },
                done: ['reload', 'tip'],
              },
              {
                label: 'IsAvailableStatusEnum__ENABLE',
                type: "confirm-button",
                message: "message_fms_account_cmp_unlock_freeze_user_confirm",
                url: '/fms-api/customer/CustomerAccountRpc/enable.json',
                if: (row) => {
                  return row.status != 'ENABLE'
                },
                params: (v) => {
                  return { id: v.id }
                },
                done: ['reload', 'tip']
              },
              {
                label: 'label_fms_account_cmp_adjust_credit',
                if: (row) => {
                  return this.accountType == 'CREDIT'
                },
                click: (row) => {

                  let _this = this

                  // delete row.roleInfos
                  this.creditForm = JSON.parse(JSON.stringify(row))
                  this.creditDialogFormVisible = true

                }
              }
            ],
          }
        ]
      }
    }


  },

  props: {

    'accountType': {
      type: String,
      defafult: ''
    },
  },

  destroyed() {

  },

  methods: {



    submitAccountForm() {

      let _this = this

      this.$refs['accountFormEl'].validate((valid) => {
        if (valid) {

          this.accountForm.accountType = this.accountType

          this.$ajax({
            url: '/fms-api/customer/CustomerAccountRpc/saveUpdate.json',
            type: 'json',
            data: this.accountForm,
            success: (responseData) => {
              this.$message({
                showClose: true,
                message: _this.$tt('tip_submit_success'),
                type: 'success'
              })
              this.$refs['superTablePage'].reload()
              this.accountDialogFormVisible = false
            }
          });

        } else {
          return false;
        }

      });

    },


    submitCreditForm() {

      let _this = this

      this.$refs['creditFormEl'].validate((valid) => {
        if (valid) {
          this.$ajax({
            url: '/fms-api/customer/CustomerCreditApplyRpc/apply.json',
            type: 'json',
            data: this.creditForm,
            success: (responseData) => {
              this.$message({
                showClose: true,
                message: _this.$tt('message_fms_account_cmp_credit_apply_submit'),
                type: 'success'
              })
              this.creditDialogFormVisible = false
            }
          });
        } else {
          return false;
        }

      });

    }

  }
};

</script>
<style>
.small-btn span {
  font-size: 14px;
}

.small-btn .el-button--small span {
  font-size: 14px;
}
</style>
